<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>XX账号安全登录</title>
</head>
<body>
	<div style="width: 50%; float: left;">
		{if $user}
		<div>
			<button id="go">点击头像授权登录</button>
		</div>
		{else}
		<div>
			<div id="error" style="color: red;"></div>
			<form action="{:url('login')}" id="login">
				<input type="text" name='username'><br/>
				<input type="password" name='password'><br/>
				<input type="submit" value='登录'>
			</form>
		</div>
		{/if}
		<form method="post" action="{:url('jump')}" id="jump">
			{:token()}
			<input type="hidden" name='response_type' value='{$response_type}'>
			<input type="hidden" name='appid' value='{$appid}'>
			<input type="hidden" name='redirect_uri' value='{$redirect_uri}'>
			<input type="hidden" name='state' value='{$state}'>
			<input type="hidden" name='scope' value='{$scope}'>
		</form>
	</div>
	<div style="width: 50%; float: left;">
		权限列表
		<ul>
			{volist name="scopeArr" id="row"}
			<li>{$scopeInfo[$row]}</li>
			{/volist}
		</ul>
	</div>
	
	<script src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
	<script>
		$('#login').submit(function() {
			var username = $('#login [name=username]').val();
			var password = $('#login [name=password]').val();
			
			$.ajax({
				url: $(this).attr('action'),
				type: 'post',
				data: {
					username: username,
					password: password
				},
				dataType: 'json'
			}).done(function(res) {
				if(res.code === 0) {
					$('#jump').submit();
				}
				else {
					$('#error').html(res.msg);
				}
			});
			
			return false;
		});
		
		$('#go').click(function() {
			$('#jump').submit();
		});
	</script>
</body>
</html>